require(['config'], function() {
    require(['jquery', 'template', 'loadHeader', 'loadFooter', 'jquery.cookie'],($, template)=>{
 // 配置自动转换 cookie 的 JSON 格式数据
 $.cookie.json = true
 // 读取保存在 cookie 中的购物车数组
 const cart = $.cookie('cart') || []

 /* 渲染表格的数据--显示购物车中选购的商品数据 */
 const html = template('cart-template', { cart })
 $('.cart-body').html(html)

 /* 定义函数，计算合计金额 */
 const total = () => {
   const pay = cart.reduce((result, prod) => {
     result += prod.amount * prod.price
     return result
   }, 0)
   $('.total').html(pay.toFixed(2))
 }

 // 计算合计
 total()

 /* 删除购物车商品 */
 $('.cart-body').on('click', '.del', e => {
   // 删除需要将保存在 cookie 中对应数组的某个元素删除掉，
   // 也要在页面的 DOM 树中删除对应的节点

   // 获取所在行
   const $tr = $(e.target).parents('tr')
   // 获取商品 id
   const id = $tr.data('id')
   // 根据 id 删除数组中的元素
   const index = cart.findIndex(prod => prod.id === id)
   cart.splice(index, 1)
   // 将删除元素后的数组重新保存到 cookie 中
   $.cookie('cart', cart, {expires: 70, path: '/'})

   // 将行从 dom 树中删除
   $tr.remove()

   // 计算合计
   total()
 })

 /* 加、减数量 */
 $('.cart-body').on('click', '.minus, .plus', e => {
   // 获取所在行
   const $tr = $(e.target).parents('tr')
   // 获取商品 id
   const id = $tr.data('id')
   // 查找数组中的商品对象
   const prod = cart.find(prod => prod.id === id)
   // 判断点击的按钮
   if ($(e.target).is('.plus')) { // 加
     prod.amount += 1
   } else { // 减
     if (prod.amount <= 1) {
       return
     }
     prod.amount -= 1
   }
   // 保存修改数量后的数组到 cookie 中
   $.cookie('cart', cart, {expires: 70, path: '/'})

   // 重新显示数量与小计
   $tr.find('.amount').html(prod.amount)
   $tr.find('.sub').html((prod.price * prod.amount).toFixed(2))

   // 计算合计
   total()
 })
})
})